<template>
    <view class="page-box">
        <header class="header"></header>
        <section class="section">
            <view class="customer-order-information">
                <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                    <view class="label">主贷人：</view>
                    <text class="t1">{{ detail.apply_name }}</text>
                </view>
                <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                    <view class="label">手机号：</view>
                    <text class="t1">{{ detail.mobile }}</text>
                </view>
                <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                    <view class="label">申请金额：</view>
                    <text class="t1">{{ detail.apply_amount }}元</text>
                </view>
                <view class="text-box row verCenter">
                    <view class="label">审批金额：</view>
                    <text class="t1">***</text>
                </view>
            </view>
            <view class="customer-order-information">
                <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                    <view class="label">车辆品牌：</view>
                    <text class="t1">{{ detail.vehicle_brand }}</text>
                </view>
                <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                    <view class="label">车牌号码：</view>
                    <text class="t1">{{ detail.car_no }}</text>
                </view>
                <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                    <view class="label">表显里程：</view>
                    <text class="t1">{{ detail.mileage }}公里</text>
                </view>
                <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                    <view class="label">首次上牌日期：</view>
                    <text class="t1">{{ detail.vehicle_first_registration_date }}</text>
                </view>
                <view class="text-box row verCenter">
                    <view class="label">VIN码：</view>
                    <text class="t1">{{ detail.vehicle_vin }}</text>
                </view>
            </view>
            <view class="list">
                <navigator class="box row bothSide verCenter" :url="'/pages/order/approveAddBaseInfo?order_id=' + order_id" hover-class="none">
                    <text class="left">个人信息</text>
                    <view class="row verCenter">
                        <text class="iconfont icon-a-tubiaochangyongsousuo2"></text>
                    </view>
                </navigator>
                <navigator class="box row bothSide verCenter" :url="'/pages/order/approveAddCarInfo?order_id=' + order_id" hover-class="none">
                    <text class="left">车辆信息</text>
                    <view class="row verCenter">
                        <text class="iconfont icon-a-tubiaochangyongsousuo2"></text>
                    </view>
                </navigator>
                <navigator class="box row bothSide verCenter" :url="'/pages/order/approveAddOrderInfo?order_id=' + order_id" hover-class="none">
                    <text class="left">进件材料</text>
                    <view class="row verCenter">
                        <text class="iconfont icon-a-tubiaochangyongsousuo2"></text>
                    </view>
                </navigator>
                <!-- 资方退回需补充资料需要显示材料补充 -->
                <navigator class="box row bothSide verCenter" :url="'/pages/order/approveAddSupplementInfo?order_id=' + order_id" hover-class="none" v-if="detail.self_business_progress_node == 7 || detail.self_business_progress_node == 9">
                    <text class="left">材料补充</text>
                    <view class="row verCenter">
                        <text class="t2">去补充</text>
                        <text class="iconfont icon-a-tubiaochangyongsousuo16" style="color: #6E767A;"></text>
                    </view>
                </navigator>
            </view>
            <view class="apply-loan-remark column">
                <view class="title">申贷备注：</view>
                <view class="textarea-box row">
                    <textarea class="uni-textarea" placeholder="请输入申贷备注 ( 200字内 )" placeholder-style="color: #6E767A;" v-model="apply_loan_remark" maxlength="200"></textarea>
                </view>
            </view>
        </section>
        <view class="btn row rowCenter verCenter" @click="submit()">提交</view>
    </view>
</template>

<script>
import { API } from '@/util/api.js';
import { initWechatShare } from '@/util/util.js';

export default {
    data() {
        return {
            order_id: '',
            apply_loan_remark: '', //申贷备注
            detail: {},
            orderInfo: {}
        };
    },
    onLoad(options) {
        this.order_id = options.order_id;
        this.getOrderDetail();
    },
    onShow() {
        this.getOrderAddedInfo();
    },
    methods: {
        /**
         * 获取微信分享配置并初始化
         */
        generateSignature() {
            this.request(API.generateSignature, 'GET', { url: window.location.href }, true).then(res => {
                // 调用封装的微信分享方法
                initWechatShare({
                    appId: res.appId,
                    timestamp: res.timestamp,
                    nonceStr: res.nonceStr,
                    signature: res.signature,
                    title: '审批',
                    desc: '小朗优创-' + (this.orderInfo.product_name || ''),
                    link: window.location.href,
                    imgUrl: this.orderInfo.product_logo || ''
                }).then(shareData => {
                    console.log('微信分享配置成功', shareData);
                }).catch(error => {
                    console.error('微信分享配置失败', error);
                });
            });
        },
        /**
         * 获取进件信息
         */
        getOrderDetail() {
            this.request(API.orderDetail, 'GET', { order_id: this.order_id }, true).then(res => {
                if (res.code === 0) {
                    this.detail = res.data;
                } else {
                    uni.showToast({
                        title: res.msg,
                        icon: 'none'
                    });
                }
            });
        },
        /**
         * 获取进件已经填写的资料
         */
        getOrderAddedInfo() {
            this.request(API.getOrderAddedInfo, 'GET', { order_id: this.order_id }, true).then(res => {
                this.orderInfo = res;
                this.generateSignature();

                this.apply_loan_remark = res.apply_loan_remark;
            });
        },
        submit() {
            //申贷备注提交
            this.request(API.submitApprove, 'POST', { order_id: this.order_id, apply_loan_remark: this.apply_loan_remark }, true).then(res => {
                if (res.code === 0) {
                    uni.showToast({
                        title: '提交成功',
                        icon: 'success',
                        duration: 2000
                    });
                    // 等待2秒后再回到上一页
                    setTimeout(() => {
                        uni.redirectTo({
                            url: "/pages/order/selfDetail?order_id=" + this.order_id
                        })
                    }, 2000);
                } else {
                    uni.showToast({
                        title: res.msg,
                        icon: 'none'
                    });
                }
            });


        }
    }
};
</script>

<style scoped lang="scss">
@import '@/assets/css/order/approveAddInfo.scss';
</style>